.procurement-component {
    padding-top: 20px;
    padding-left: 10%;
    padding-right: 10%;
}

.procurement-component .base-info .status-element {
    display: none;
}

.procurement-component .item-div {
    display: none;
}

.procurement-component .item-div.show {
    display: block;
}

.procurement-component .item-div .item-panel .self .code {
    width: 10%;
}

.procurement-component .item-div .item-panel .self .name {
    width: 65%;
}

.procurement-component .handle-div {
    display: none;
}

.procurement-component .handle-div.show {
    display: block;
}

.procurement-component .process-records-div {
    display: none;
}

.procurement-component .process-records-div.show {
    display: block;
}

.procurement-component .handle-div .submit-div {
    display: none;
}

.procurement-component .handle-div .submit-div.show {
    display: block;
}

.procurement-component .handle-div .submit-div .reviewer-wrap {
    display: none;
}

.procurement-component .handle-div .submit-div .submit-button {
    display: none;
}

.procurement-component .handle-div .submit-div .submit-button.show {
    display: inline-block !important;
}

.procurement-component .handle-div .submit-div .withdraw-button {
    display: none;
}

.procurement-component .handle-div .submit-div .withdraw-button.show {
    display: inline-block !important;
}

.procurement-component .handle-div .submit-div .reset-button {
    display: none;
}

.procurement-component .handle-div .submit-div .reset-button.show {
    display: inline-block !important;
}

.procurement-component .handle-div .review-div {
    display: none;
}

.procurement-component .handle-div .review-div.show {
    display: block;
}

.procurement-component .handle-div .approve-div {
    display: none;
}

.procurement-component .handle-div .approve-div.show {
    display: block;
}

.procurement-component .process-records-div .process-record-panel .self .created-date  {
    width: 15%;
}

.procurement-component .process-records-div .process-record-panel .self .handler {
    width: 15%;
}

.procurement-component .process-records-div .process-record-panel .self .status {
    width: 8%;
}

.procurement-component .process-records-div .process-record-panel .self .operate  {
    width: 8%;
}

.procurement-component .process-records-div .process-record-panel .self .content  {
    width: 50%;
}
